<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<html>
<head>
    <title>意见反馈</title>
    <style type="text/css">
        *{
            margin: 0;
            padding: 0;
        }
        body{
            background-color: #f7f7f7;
        }
        #middle{
            overflow: hidden;
        }
        #middle #left,#middle #right{
            position: relative;
            top: 30px;
            float: left;
            background-color: white;
        }
        #middle #left{
            left: 80px;
            height:auto;
            width: 230px;
        }
        #middle #right{
            left: 100px;
            height:auto;
            width: 950px;
            padding-bottom: 40px;
        }
        #middle #left ul{
            /*border: 1px solid black;*/
            /*height: 95%;*/
            /*width: 90%;*/
            list-style: none;
            margin: 5% auto;
        }
        #middle #left ul li>a{
            display: inline-block;
            margin: 0 10px;
            padding:23px 20px;
            width: 75%;
            color: #666666;
            text-decoration: none;
            font-weight: 600;
        }
        #middle #left ul li>a.bottom_line{
            border-bottom: 1px solid #ececec;
        }
        #middle #left ul li>a:hover,#middle #left ul li>a.active{
            color: #3eabff;
            padding-left: 22px;
            text-decoration: none;
        }
        #middle #left ul li>a.active,#middle #left ul li>a.active:hover{
            border-left: 2px solid #3eabff;
        }
        #middle #left ul li>a:hover{
            border-left: 1px solid #3eabff;
        }
        #middle #right>h3{
            border-bottom: 1px solid #ececec;
            margin: 20px;
        }
        #middle #right #right_top{
            height:auto;
            overflow: hidden;
        }
        #middle #right #right_top>form{
            margin: 0 20px;
            line-height: 2.5;
            font-size: 14px;
            color: #666666;
        }
        #middle #right #right_top>form textarea{
            padding: 10px;
        }
        #middle #right #right_top>form input{
            margin-top: 20px;
            padding-left: 10px;
            width: 650px;
            height: 40px;
        }
        #middle #right #right_top>form button{
            margin-top: 20px;
            padding:10px 80px ;
            background-color: #40a8ff;
            color: white;
            border: 0;
        }
        #middle #right #right_top>form button:hover{
            cursor: pointer;
        }
        #middle #right #right_top>ul li {
            list-style: none;
            margin-top: 2px;
            margin-bottom:3px ;
            color: #666666;
            font-size: 14px;
        }
        #middle #right #right_top>form>ul,#middle #right>div>form {
            float: left;
        }
        #middle #right #suggest{
            position: relative;
            width: 95%;
            height:auto;
            margin-left: 20px;
            padding-top: 20px;
            z-index: 4;
        }
        #middle #right #suggest>h3{
            background-color: #f8f8f8;
            height: 50px;
            line-height: 50px;
            padding-left: 10px;
        }
        #middle #right #suggest>h3 input{
            height: 30px;
            width:250px;
            margin-left: 500px;
            padding-left: 10px;
        }
        #middle #right #suggest>h3 img{
            margin-bottom: -10px;
        }
        #middle #right #suggest>ul>li{
            list-style: none;
            color: #666666;
            line-height: 2;
            border-bottom:1px solid #ececec;
            padding-top: 10px;
            padding-bottom: 20px;
            font-size: 14px;
        }
        #middle #right #suggest .has_background{
            padding: 5px 20px;
            background-color: #d8efff;
        }
        #middle #right #suggest .time{
            color: #9999b2;
        }
        #middle #right #suggest .manager{
            color: #f19901;
        }
    </style>
</head>
<body>
            <%@include file="nav.jsp"%>
            <div id="middle" >
                <%--左边部分--%>
                <div id="left">
                    <ul>
                        <li><a href="aboutus.jsp" class="bottom_line">关于我们</a></li>
                        <li><a href="aboutgroup.jsp" class="bottom_line">团队介绍</a></li>
                        <li><a href="job.jsp" class="bottom_line">人才招聘</a></li>
                        <li><a href="contactus.jsp" class="bottom_line">联系我们</a></li>
                        <li><a href="feedback.jsp" class="active bottom_line">意见反馈</a></li>
                        <li><a href="#" class="bottom_line">友情链接</a></li>
                        <li><a href="#">申请链接</a></li>
                    </ul>
                </div>
                <%--右边部分--%>
        <div id="right">
            <h3>意见反馈</h3>
                <div id="right_top">
                    <form action="#" method="post">
                        <textarea  cols="87" rows="15" placeholder="请填写您遇到的问题或意见建议，您的意见对微课慕课网非常重要，是微课慕课网前进的动力！"></textarea><br>
                        <input type="text" placeholder="请留下您的联系方式（手机号、邮箱、QQ），产品经理可能会与您联系！"><br>
                        <button type="submit">提交</button>
                    </form>
                    <ul>
                        <li>微课幕课交流QQ群</li>
                        <li>282673318</li>
                        <li>职教微课大赛专属QQ群</li>
                        <li>474297139</li>
                        <li><br></li>
                        <li>技术支持服务电话</li>
                        <li>010-83456666</li>
                        <li>010-84929209</li>
                    </ul>
                </div>

                <div id="suggest">
                    <h3>全部反馈<input placeholder="搜索意见反馈内容"><a href="#"><img src="static/img/feedback_search.jpg"></a></h3>
                    <ul>
                        <li>
                            <p>我是一老师，刚才注册了，请申核。</p>
                            <p class="time">2016-04-07 提出</p>
                            <p class="has_background"><span class="manager">微课慕课产品经理:</span>已审核完毕。</p>
                        </li>

                        <li>
                            <p>为什么上传不了视频？什么原因呢</p>
                            <p class="time">2016-03-15 提出</p>
                            <p class="has_background"><span class="manager">微课慕课产品经理:</span>老师您好，请问使用什么版本的浏览器，经测试， 视频上传是可以的。谢谢！</p>
                        </li>

                        <li>
                            <p>您好，上传的视频有大小限制吗</p>
                            <p class="time">2016-03-15 提出</p>
                            <p class="has_background"><span class="manager">微课慕课产品经理:</span>暂无限制，但建议不要上传大于1G的视频，如果视频太大您可以通过格式工厂把视频切割成几个小片段视频。</p>
                        </li>

                        <li>
                            <p>我是周立新，今天注册成功的，把自己的用户名忘记了，能不能帮助我找到啊？jmzxzlx@163.com</p>
                            <p class="time">2016-03-04 提出</p>
                            <p class="has_background"><span class="manager">微课慕课产品经理:</span>已发送至您邮箱。</p>
                        </li>

                        <li>
                            <p>您好，我是一名中学的老师，希望能够下载一些微课。请审核。</p>
                            <p class="time">2016-02-19 提出</p>
                            <p class="has_background"><span class="manager">微课慕课产品经理:</span>已经审核完毕，找优质教育资源，上微课慕课网， 分享资源，传递价值。</p>
                        </li>
                    </ul>
                </div>


        </div>

    </div>
    <%@include file="footer.jsp"%>
</body>
</html>
